doctype
html
head
	meta(charset="utf-8")
	meta(name="viewport", content="width=device-width, initial-scale=1, maximum-scale=1")
	title 消息盒子
	link(rel="stylesheet", href="/plugins/layui/css/layui.css")
	link(rel="stylesheet", href="/plugins/layui/css/modules/layim/msgbox.css")
body
	ul.layim-msgbox#LAY_view
	div(style="margin: 0 15px;")
		blockquote.layui-elem-quote 消息盒子
	textarea(title="消息模版", id="LAY_tpl", style="display:none;", type="text/html")
		span {{# layui.each(d.data, function(index, item){ }}
		span {{# if(item.from) { }}
				li(data-uid="{{ item.from }}", data-fromGroup="{{ item.from_group }}")
					a(href="/u/{{ item.from }}/", target="_blank")
						img.layui-circle.layim-msgbox-avatar(src="{{ item.user.avatar }}")
					p.layim-msgbox-user
						a(href="/u/{{ item.from }}/", target="_blank") {{ item.user.username||'' }}
						span {{ item.time }}
					p.layim-msgbox-content {{ item.content }}
						span {{ item.remark ? '附言: '+item.remark : '' }}
					p.layim-msgbox-btn
						button.layui-btn.layui-btn-small(data-type="agree") 同意
						button.layui-btn.layui-btn-small.layui-btn-primary(data-type="refuse") 拒绝
		span {{# } else { }}
				li.layim-msgbox-system
					p
						em 系统：
						{{ item.content }}
						span {{ item.time }}
		span {{# } }); }}
	script(src="/plugins/layui/layui.js")
	script.
		layui.use(['layim', 'flow'], function(){
			var _user = '#{data._id}';
			var layim = layui.layim
			,layer = layui.layer
			,laytpl = layui.laytpl
			,$ = layui.jquery
			,flow = layui.flow;

			var cache = {}; //用于临时记录请求到的数据
			//请求消息
			var renderMsg = function(page, callback){
				//实际部署时，请将下述 getmsg.json 改为你的接口地址
				$.post('/users/im/msgbox', {
					page: page || 1
				}, function(res){
					if(res.code != 0){
						return layer.msg(res.msg);
					}
					//记录来源用户信息
					layui.each(res.data, function(index, item){
						cache[item.from] = item.user;
					});
					callback && callback(res.data, res.pages);
				});
			};
			flow.load({
				elem: '#LAY_view'
				,isAuto: false
				,end: '<li class="layim-msgbox-tips">暂无更多新消息</li>'
				,done: function(page, next){
					renderMsg(page, function(data, pages){
						var html = laytpl(LAY_tpl.value).render({
							data: data
							,page: page
						});
						next(html, page < pages);
					});
				}
			});


			//操作
			var active = {
				//同意
				agree: function(othis){
					var li = othis.parents('li')
					,uid = li.data('uid')
					,from_group = li.data('fromgroup')
					,user = cache[uid];
					//选择分组
					parent.layui.layim.setFriendGroup({
						type: 'friend'
						,username: user.username
						,avatar: user.avatar
						,group: parent.layui.layim.cache().friend //获取好友分组数据
						,submit: function(group, index){
							$.post('/users/im/agreeUserApply', {
								from: uid
								,from_group: from_group
								,group: group
								,user:_user
							}, function(res){
								if(res.code != 0) {
									return layer.msg(res.msg);
								}else if(res.code == 0) {
									//将好友追加到主面板
									parent.layui.layim.addList({
										type: 'friend'
										,avatar: user.avatar 
										,username: user.username
										,groupid: group
										,id: uid
										,sign: user.sign
									});
									parent.layer.close(index);
									othis.parent().html('已同意');
								}
								
							});
							
						}
					});
				}
				//拒绝
				,refuse: function(othis){
					var li = othis.parents('li')
					,uid = li.data('uid');
					layer.confirm('确定拒绝吗？', function(index){
						$.post('/users/im/refuseUserApply', {
							uid: uid
							,user:_user
						}, function(res){
							if(res.code != 0){
								return layer.msg(res.msg);
							}else if(res.code == 0) {
							}
							layer.close(index);
							othis.parent().html('<em>已拒绝</em>');
						});
					});
				}
			};

			$('body').on('click', '.layui-btn', function(){
				var othis = $(this), type = othis.data('type');
				active[type] ? active[type].call(this, othis) : '';
			});
		});


